<template>
    <div id="container"></div>
    </template>
     
    <script>

    export default {
        props:{
            data:
            {
                type:Object,
                default:()=>({})
            }
        },
        mounted(){
            this.getmap()
        },
        methods:{
            getmap(){
            window.onLoad  = function(){
            var map = new AMap.Map('container',{
            zoom:20,
            center:[121.578573, 31.115055],});
            var marker = new AMap.Marker({
                position: new AMap.LngLat(121.578573, 31.115055),   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
                title: ''
            });
            map.add(marker);
            }
            var key = "5e96b8c4bc5f9399612ae8dbedd08ed7";
            var url = `https://webapi.amap.com/maps?v=1.4.15&key=${key}&callback=onLoad`;
            var jsapi = document.createElement('script');
            jsapi.charset = 'utf-8';
            jsapi.src = url;
            document.head.appendChild(jsapi); 
            },
            getparent(){
                console.log(this.$parent.title)
            }
        }
    }
    </script>
    <style lang="less" scoped>
   #container {
    //必须设置其尺寸
      height: 360px;
      width: 650px;
    }
    </style>